<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <style type="text/css">
        .count {
    margin-top: 50px;
    font-size: 32px;
}
        #number {
    font-size: 42px;
    text-shadow: 0 -1px 0 #72a441;
    color: #360;
    font-weight: 700;
}
        #number1 {
    font-size: 42px;
    text-shadow: 0 -1px 0 #72a441;
    color: #360;
    font-weight: 700;
}
    </style>
    <script type="text/javascript" src="http://libs.useso.com/js/jquery/1.7.2/jquery.min.js"></script>
</head>
<body>
    <div class="count">累计交易金额：<span id="number"></span></div>
    <div class="count">累计交易订单数：<span id="number1"></span></div>


<script>
function magic_number(value) {
	var num = $("#number");
    num.animate({count: value}, {
        duration: 500,
        step: function() {
            num.text(String(parseInt(this.count)));
		}
	});
};

function update() {
    $.getJSON("http://10.0.1.200/number.php?jsonp=?", function(data) {
		magic_number(data.n);
    });
};

setInterval(update, 3000);
update();
</script>

<script>
function magic_number1(value) {
	var num = $("#number1");
    num.animate({count: value}, {
        duration: 500,
        step: function() {
            num.text(String(parseInt(this.count)));
		}
	});
};

function update() {
    $.getJSON("http://10.0.1.200/number.php?jsonp=?", function(data) {
		magic_number1(data.n);
    });
};

setInterval(update, 3000);
update();
</script>
</body>
</html>